<template>
    <div>
      <!--导航栏+轮播图-->
      <div class="a">
        <div class="a1">
          <div class="a2">
            <!--导航栏-->
            <div class="a7">
              <div class="a3">
                <div class="a4"><img src="../../assets/a1.png" height="30" width="110" class="aa"/></div>
                <div class="a5">
                  <button class="a5a">
                    <router-link :to="'Home'">首页</router-link>
                  </button>
                  <button class="a5a">
                    <router-link :to="'DreamService'">到梦服务</router-link>
                  </button>
                  <button class="a5a">
                    <router-link :to="'News'">校企共建</router-link>
                  </button>
                  <button class="a5a">第二课堂全国活动查询</button>
                  <button class="a5a">第二课堂全国活动证书查询</button>
                </div>
                </div>
            </div>

            <div class="i1">
              <div class="i8">
                <div class="i9">
                  <div class="ii9">
                    <div style="margin-top: 130px;">
                      <el-input placeholder="请输入内容" v-model="input3" class="input-with-select">
                        <el-select v-model="select" slot="prepend" placeholder="请选择">
                          <el-option label="餐厅名" value="1"></el-option>
                          <el-option label="订单号" value="2"></el-option>
                          <el-option label="用户电话" value="3"></el-option>
                        </el-select>
                        <el-button slot="append" icon="el-icon-search"></el-button>
                      </el-input>
                    </div>
                  </div>
                </div>
              </div>    <!--<img src="../../assets/b1.png" height="360" width="100%"/>-->
            <div class="i2">
              <div class="i3"></div>
              <div class="i4">详细数据</div>
            </div>
            </div>
          </div>
        </div>
      </div>

      <div class="i5">
        <el-table
          style="width: 100%">
          <el-table-column
          width="100px">
          </el-table-column>
          <el-table-column
            prop="id"
            label="序号"
            width="230px">
          </el-table-column>
          <el-table-column
            prop="name"
            label="活动名称"
            width="230px">
          </el-table-column>
          <el-table-column
            prop="type"
            label="活动类型"
            width="230px">
          </el-table-column>
          <el-table-column
            prop="type"
            label="主办单位"
            width="230px">
          </el-table-column>
          <el-table-column
            prop="type"
            label="活动时间"
            width="230px">
          </el-table-column>
          <el-table-column
            label="操作">
            <template slot-scope="scope">

            </template>
          </el-table-column>
        </el-table>
      </div>

      <div style="height: 30px;background: #F4F4F4"></div>
      <div class="i6">
        <div class="i3"></div>
        <div class="i4">共建单位 (排名不分先后)</div>
      </div>
      <div class="i7"><img src="../../assets/c1.png" height="200" width="1210"/></div>


      <!--页尾-->
      <div class="c1">
        <div class="c2">
          <div class="c6">
            <div class="c7">以下网站内公布活动若不在本库内，亦受本库认可 </div>
            <div class="c7" style="color:#4994FB;cursor: pointer">中国高等教育学会官网</div>
            <div class="c7" style="color:#4994FB;cursor: pointer">附件：2021全国普通高校大学生竞赛榜单内竞赛项目名单</div>
          </div>
          <div class="c4"></div>
          <div class="c3">
            <div>到梦简介</div>
            <div>到梦协议</div>
            <div>到梦服务</div>
            <div>第二课堂全国活动查询</div>
            <div>第二课堂全国活动证书查询</div>
            <div>校企共建</div>
            <div>问题与帮助</div>
            <div>联系我们</div>
            <div>APP使用说明</div>
            <div>盗梦空间使用章程和制度</div>
          </div>
          <div class="c4"></div>
          <div class="c5">
            <div>京公网安备11010802024175 到梦空间系统</div>
            <div>2016-2021 Copyright©全国共青团研究中心</div>
          </div>
        </div>
      </div>


    </div>
</template>

<script>
    export default {
        name: "ActiveSearch"
    }
</script>

<style scoped>
  button{
    border: none;
    background-color: transparent;
    box-shadow: none;
  }
  a{
    color: black;
    text-decoration: none;
  }
  .a1{
    width: 100%;
    height: 410px;
  }
  .a2{
    position: relative;
  }
  .a7{

    width: 100%;
    height: 60px;
    position: fixed;
    z-index: 2;
    background:#FFFFFF ;
  }
  .a3{
    display: flex;
    width: 1210px;
    height: 50px;
    margin: auto;
  }
  .a4{
    width: 100px;
    height: 55px;
    display: grid;
    align-items: center;
    cursor: pointer;
  }
  .a5{
    width: 700px;
    font-size: 13px;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
  }
  .a5a:hover{
    cursor: pointer;
    color: gold;
  }
  .a5a>a:hover{
    cursor: pointer;
    color: gold;
  }

  .a9a>a:hover{
    cursor: pointer;
    color: orange;
  }
 .i1{
   width: 100%;
   position: absolute;
 }
  .i2{
    height: 80px;
    background: #F4F4F4;
    display: flex;
    align-items: center;
    padding-left: 90px;
  }
  .i3{
    border-left: 6px solid #4994FB;
    height: 20px;
  }
  .i4{
    padding-left: 10px;
  }
  .i5{
    margin-top: 35px;
  }
  .i6{
    display: flex;
    padding-left: 90px;
    padding-top: 30px;
  }
  .i7{
    width: 1210px;
    margin: auto;
    margin-top: 30px;
  }
  .i8{
    background-image: url("../../assets/c2.png");
    width: 100%;
    height: 360px;
    position: relative;
  }
  .i9{
    position: absolute;
    z-index: 1;
    width: 100%;
    margin-top: 40px;
  }
  .ii9{
    width: 100%;
    height: 355px;
    margin: auto;
    display: grid;
  }
  .iii9{
    height: 60px;
    width: 1000px;
    border-radius: 35px;
    justify-self: center;
    align-self: center;
  }
  .c1{
    background: #D6D8DA;
    margin-top: 20px;
    width: 100%;
    height: 160px;
    position: absolute;
  }
  .c2{
    width: 1210px;
    margin: auto;
  }
  .c3{
    height: 40px;
    display: flex;
    font-size: 13px;
    justify-content: space-between;
    align-items: center;
    color: black;
    cursor: pointer;
  }
  .c4{
    border-bottom: 1px solid darkgray;
    margin-top: 10px;
  }
  .c5{
    width: 700px;
    margin: auto;
    margin-top: 10px;
    display: flex;
    font-size: 13px;
    justify-content: space-evenly;
    align-items: center;
    color: black;
  }
  .c6{
    width: 800px;
    margin: auto;
    margin-top: 10px;
    display: flex;
    font-size: 12px;
    justify-content: space-evenly;
    padding-top: 10px;
    color: black;
  }
  .c7{
    height: 30px;
  }
</style>
